<!DOCTYPE html>
<html>
	<head lang="en">
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
		<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport">
		<meta content="black" name="apple-mobile-web-app-status-bar-style">
		<meta content="false" name="twcClient" id="twcClient">
		<meta content="no-cache,must-revalidate" http-equiv="Cache-Control">
		<meta content="no-cache" http-equiv="pragma">
		<meta content="0" http-equiv="expires">
		<!--允许全屏模式-->
		<meta content="yes" name="apple-mobile-web-app-capable" />
		<!--指定sari的样式-->
		<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
		<meta content="telephone=no" name="format-detection" />
		<title>扫一扫</title>
		<!-- <link href="../css/mui.min.css" rel="stylesheet" />-->
		<!-- <link rel="stylesheet" href="../css/default.css"> -->
		<style>
			.mui-bar-nav {
				top: 0;
				-webkit-box-shadow: 0 1px 6px #ccc;
				box-shadow: 0 1px 6px #ccc;
      }
			.mui-bar {
				position: fixed;
				z-index: 999;
				right: 0;
				left: 0;
				height: 44px;
				padding-right: 10px;
				padding-left: 10px;
				border-bottom: 0;
				background-color: #f7f7f7;
				-webkit-box-shadow: 0 0 1px rgba(0,0,0,.85);
				box-shadow: 0 0 1px rgba(0,0,0,.85);
				-webkit-backface-visibility: hidden;
				backface-visibility: hidden;
			}
			.mui-pull-center {
				position: absolute;
				left: 0;
				top: 0;
				width: 100%;
				text-align: center;
				color: #fff;
				font-size: 20px;
				line-height: 44px;
			}
			.mui-pull-right {
				float: right;
				color: #fff;
				position: relative;
				z-index: 2;
			}
			.mui-pull-right img {
				width: 30px;
			}
			.mui-bar-footer {
				bottom: 0;
			}
			#bcid {
				width: 100%;
				height: 85%;
				position: absolute;
				left: 0;
				top: 3rem;
				z-index: 1;
			}
		 .fbt{
				color: #0E76E1;
				width: 50%;
				background-color: #ffffff;
				float: left;
				line-height: 44px;
				text-align: center;
			}
    </style>
	</head>
	<body>
		<header class="mui-bar mui-bar-nav" style="background-color: #0787d5;">
			<span class="mui-pull-center">扫一扫</span>
			<span class="mui-pull-right" style="padding:.5rem 0;" id="turnTheLight"><img src="image/sgd.png" alt=""></span>
		</header>
		<div>
			<div id="bcid">
				<!--盛放扫描控件的div-->
			</div>
		</div>


		<div class="mui-bar mui-bar-footer" style="padding: 0px;">
			<div class="fbt" onclick="scanPicture();">从相册选择二维码</div>
			<div class="fbt" onclick="scanClose();">取　 消</div>
		</div>
	</body>
	<script src="../js/common/mui.min.js"></script>
	<script type="text/javascript">
		scan = null; //扫描对象
		mui.plusReady(function() { //通过mui初始化扫描
			mui.init();
			startRecognize(); //开始扫描
		});

		function startRecognize() { //开启扫描方法
			try {
				var filter;
				//自定义的扫描控件样式
				var styles = {
					frameColor: "#29E52C",
					scanbarColor: "#29E52C",
					background: ""
				}
				//扫描控件构造
				scan = new plus.barcode.Barcode('bcid', filter, styles);
				scan.onmarked = onmarked; ////扫描完毕后的回调
				scan.onerror = onerror; //扫描错误
				scan.start();

			} catch (e) {
				alert("出现错误啦:\n" + e);
			}
		};

		//打开关闭闪光灯处理
		var flag = false;
		document.getElementById("turnTheLight").addEventListener('tap', function() {
			if (flag == false) {
				scan.setFlash(true);
				flag = true;
			} else {
				scan.setFlash(false);
				flag = false;
			}
		});
		// 从相册中选择二维码图片
		function scanPicture() { //可以直接识别二维码图片
			plus.gallery.pick(function(path) {
				plus.barcode.scan(path, onmarked, function(error) {
					plus.nativeUI.alert("无法识别此图片");
				});
			}, function(err) {
				plus.nativeUI.alert("Failed: " + err.message);
			});
		}
		//这个是扫描二维码的回调函数，type是扫描二维码回调的类型
		function onmarked(type, result) {
			var text = '';
			switch (type) { //QR,EAN13,EAN8都是二维码的一种编码格式,result是返回的结果
				case plus.barcode.QR:
					text = 'QR: ';
					break;
				case plus.barcode.EAN13:
					text = 'EAN13: ';
					break;
				case plus.barcode.EAN8:
					text = 'EAN8: ';
					break;
			}
			localStorage.QRinfo = [result];
			// localStorage.setItem("QRinfo", result)
			/* window.location.href = "single_code.html?id="+result; */
			// alert( text + " : "+ result+'111' );//扫描完毕后的回调 ;
			
			scan.close();
			javascript: window.history.back(-1);
		};
		//关闭控件
		function scanClose() {
			scan.close();
			javascript: window.history.back(-1);

		}
	</script>
</html>
